
<!doctype html>
<html lang="en">
	<head>
		<title>小宝同学</title>
		
		
<!-------------------- 公共头部 --------------------------->
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport">
		<meta content="yes" name="apple-mobile-web-app-capable">
		<meta content="black" name="apple-mobile-web-app-status-bar-style">
		<meta content="telephone=no" name="format-detection">
		
		<link rel="stylesheet" type="text/css" href="../static/css/mui.min.css"/>
		<link rel="stylesheet" type="text/css" href="../static/css/mui.previewimage.css"/>
		<link rel="stylesheet" type="text/css" href="../static/css/css.css"/>
		<link rel="stylesheet" type="text/css" href="../static/css/swiper.min.css"/>
		<script type="text/javascript" src="../static/js/swiper.min.js"></script>
		<script type="text/javascript" src="../static/js/mui.min.js"></script>
		<script type="text/javascript" src="../static/js/jquery-1.8.3.min.js"></script>
		<script type="text/javascript" src="../static/js/localImg.js"></script>
		<script type="text/javascript" src="../static/js/mobileImg.js"></script>
		<script type="text/javascript" src="../static/js/mui.zoom.js"></script>
		<script type="text/javascript" src="../static/js/mui.previewimage.js"></script>
<!-- 		<script type="text/javascript" src="//res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script> -->
		
		<style type="text/css">
			.divHeight {
			    width: 100%;
			    height: 5px;
			    background: #f5f5f5;
			    position: relative;
			    overflow: hidden;
			}
			
			.mui-show-loading {  
			    position: fixed;  
			    padding: 5px;  
			    width: 120px;  
			    min-height: 120px;  
			    top: 45%;  
			    left: 50%;  
			    margin-left: -60px;  
			    background: rgba(0, 0, 0, 0.6);  
			    text-align: center;  
			    border-radius: 5px;  
			    color: #FFFFFF;  
			    visibility: hidden;  
			    margin: 0;  
			    z-index: 2000;  
			
			    -webkit-transition-duration: .2s;  
			    transition-duration: .2s;  
			    opacity: 0;  
			    -webkit-transform: scale(0.9) translate(-50%, -50%);  
			    transform: scale(0.9) translate(-50%, -50%);  
			    -webkit-transform-origin: 0 0;  
			    transform-origin: 0 0;  
			}  
			.mui-show-loading.loading-visible {  
			    opacity: 1;  
			    visibility: visible;  
			    -webkit-transform: scale(1) translate(-50%, -50%);  
			    transform: scale(1) translate(-50%, -50%);  
			}  
			.mui-show-loading .mui-spinner{  
			    margin-top: 24px;  
			    width: 36px;  
			    height: 36px;  
			}  
			.mui-show-loading .text {  
			    line-height: 1.6;  
			    font-family: -apple-system-font,"Helvetica Neue",sans-serif;  
			    font-size: 14px;  
			    margin: 10px 0 0;  
			    color: #fff;  
			}  
			
			.mui-show-loading-mask {  
			  position: fixed;  
			  z-index: 1000;  
			  top: 0;  
			  right: 0;  
			  left: 0;  
			  bottom: 0;  
			}  
			.mui-show-loading-mask-hidden{  
			    display: none !important;  
			}
			
			.list-nothing {
			    width: 100%;
			    height: 4rem;
			    display: flex;
			    flex-direction: column;
			    align-items: center;
			    justify-content: center;
			    line-height: 1.01;
			}
			.list-nothing__icon {
			    background: url(../static/img/bg_nothing.png) no-repeat 0 0;
			    background-size: contain;
			    width: 2rem;
			    height: 2rem;
			}
			.list-nothing__text {
			    margin-top: 0.4rem;
			    font-size: 0.2rem;
			    color: #151617;
			}
		</style>
		
		<script type="text/javascript">
			//扩展mui.showLoading  
			(function($, window) {  
			    //显示加载框  
			    $.showLoading = function(message,type) {  
			        if ($.os.plus && type !== 'div') {  
			            $.plusReady(function() {  
			                plus.nativeUI.showWaiting(message);  
			            });  
			        } else {  
			            var html = '';  
			            html += '<i class="mui-spinner mui-spinner-white"></i>';  
			            html += '<p class="text">' + (message || "数据加载中") + '</p>';  
		
			            //遮罩层  
			            var mask=document.getElementsByClassName("mui-show-loading-mask");  
			            if(mask.length==0){  
			                mask = document.createElement('div');  
			                mask.classList.add("mui-show-loading-mask");  
			                document.body.appendChild(mask);  
			                mask.addEventListener("touchmove", function(e){e.stopPropagation();e.preventDefault();});  
			            }else{  
			                mask[0].classList.remove("mui-show-loading-mask-hidden");  
			            }  
			            //加载框  
			            var toast=document.getElementsByClassName("mui-show-loading");  
			            if(toast.length==0){  
			                toast = document.createElement('div');  
			                toast.classList.add("mui-show-loading");  
			                toast.classList.add('loading-visible');  
			                document.body.appendChild(toast);  
			                toast.innerHTML = html;  
			                toast.addEventListener("touchmove", function(e){e.stopPropagation();e.preventDefault();});  
			            }else{  
			                toast[0].innerHTML = html;  
			                toast[0].classList.add("loading-visible");  
			            }  
			        }     
			    };  
		
			    //隐藏加载框  
			      $.hideLoading = function(callback) {  
			        if ($.os.plus) {  
			            $.plusReady(function() {  
			                plus.nativeUI.closeWaiting();  
			            });  
			        }   
			        var mask=document.getElementsByClassName("mui-show-loading-mask");  
			        var toast=document.getElementsByClassName("mui-show-loading");  
			        if(mask.length>0){  
			            mask[0].classList.add("mui-show-loading-mask-hidden");  
			        }  
			        if(toast.length>0){  
			            toast[0].classList.remove("loading-visible");  
			            callback && callback();  
			        }  
			      }  
			})(mui, window);
		</script>
<!-------------------- 公共头部 --------------------------->
		
		
		<link rel="stylesheet" type="text/css" href="../static/css/chat.css"/>
	</head>

	<body>
		<div class="message" id="message">
		
		<div class="show">
			<div class="time">2022-11-04 10:11</div>
			<div class="msg">
			<img style="" src="../static/images/100.jpg" alt="" />
			<span style="position: absolute;right: 1.1rem;"></span>
				<p>在？</p>
			</div>
		</div>
		<div class="send">
				<div class="time">2022-11-04 10:13</div>
				<div class="msg">
				<img style=""  src="../static/images/100.jpg" alt="" />
				<span style="position: absolute;left: 1.1rem;"></span>
					<p>在的</p>
				</div>
			</div>
		<div class="show">
			<div class="time">2022-11-04 10:14</div>
			<div class="msg">
			<img style="" src="../static/images/100.jpg" alt="" />
			<span style="position: absolute;right: 1.1rem;"></span>
				<p>在做什么？</p>
			</div>
		</div>
		<div class="send">
				<div class="time">2022-11-04 10:13</div>
				<div class="msg">
				<img style=""  src="../static/images/100.jpg" alt="" />
				<span style="position: absolute;left: 1.1rem;"></span>
					<p>吃饭啊。</p>
				</div>
			</div>
		</div>
		<br/><br/><br/>
		<div class="footer">
			<label>
				<img onclick="showIco()" src="../static/img/b.png" alt="" />
				<input type="file" name="img" id="sendimg" hidden="hidden"/>
				<img src="../static/img/s.png" alt="" />
			</label>
			<input style="width: 50%;" type="text" id="text"  />
			<p style="margin-top: 0.22rem;line-height: 0.9rem;height: 0.9rem;" id="submit">发送</p>

			<div class="express">
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😍</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😁</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😘</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍎</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍏</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍊</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍋</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😖</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😉</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😏</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😏</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍒</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍇</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍉</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍓</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍑</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍈</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍌</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍐</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍍</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍆</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍅</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍠</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🌽</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😳</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😡</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😓</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😭</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😱</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😜</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😰</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😢</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😚</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😄</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😀</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😪</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😣</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😔</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😠</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😌</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😀</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😝</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😂</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😥</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😃</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😞</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😒</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😀</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">👽</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😄</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😯</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😂</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😈</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😀</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😐</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😃</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😠</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😑</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😥</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😬</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😟</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😢</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😦</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😱</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😵</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😴</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😧</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😙</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😖</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😛</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😭</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😒</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😗</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😚</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😌</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😪</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😻</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😏</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🙆</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😽</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😄</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😀</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😕</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😂</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😅</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😐</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😃</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😆</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😑</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😮</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😨</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😢</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😦</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😱</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😵</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😤</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😶</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😀</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😝</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😎</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😞</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😋</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😔</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😀</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😒</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😜</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😌</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😗</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😏</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🙊</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">👦</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">👩</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😄</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😃</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😀</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😀</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😉</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😗</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😙</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😜</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😝</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😛</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😁</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😌</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">💛</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😒</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😞</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😣</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😀</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😂</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😭</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😪</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😥</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😅</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😀</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😩</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😠</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😤</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😖</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😋</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😷</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😴</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😟</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😦</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😈</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">👿</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😬</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😯</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😶</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😇</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">😑</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍡</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍲</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍱</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍔</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍤</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍕</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍮</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍩</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍗</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍝</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍳</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍭</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍪</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍦</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍖</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍟</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍯</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍬</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍰</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍧</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍵</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍹</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">🍺</div>
				<div style="font-size: 24px; padding: 0rem 0.12rem;">💔</div>

			</div>

		</div>
	</body>

	
	<script type="text/javascript">
	var imgUrl="[[${imgUrl}]]";
	
	var toUserId="[[${toUser.id}]]";
	var toWxName="[[${toUser.wxName}]]";
	var toPhoto="[[${toUser.weixinPhoto}]]";
	var toMood="[[${toUser.mood!=null && toUser.mood!='' ? 'border: 1px solid '+toUser.mood : ''}]]";
	
	var userId="[[${user.id}]]";
	var wxName="[[${user.wxName}]]";
	var photo="[[${user.weixinPhoto}]]";
	var mood="[[${user.mood!=null && user.mood!='' ? 'border: 1px solid '+user.mood : ''}]]";
	
	var maxChatId=null;
	var isInterval=true;
	var interval=null;
	var intervalLock=false;
	
	$(function(){
		mui.previewImage();
		
		page(1,1000,true);
		
		$(".express div").click(function (){
			$("#text").val($("#text").val()+$(this).text());
			upBtu();
			upView();
		});
		
	})
	
	function pageInterval(isView){
		if(intervalLock){
			return;
		}
		intervalLock=true;
		$.ajax({
			url: '[[${sysUrl}]]/wensay/chat/interval/page',
			type: "post",
			data:{
				'toUserId': toUserId,
				'maxChatId':maxChatId
			},
			dataType: "json",
			success:function(data){
				if(data.meta.success){
					var content=data.data;
					var html=[];
					for (var i = 0; i < content.length; i++) {
						if(maxChatId==null || content[i].id>maxChatId){
							maxChatId=content[i].id;
						}
						if(content[i].type!=5){
							if(content[i].userId==userId){
								html.push('<div class="show">');
									html.push('<div class="time">'+content[i].createTime+'</div>');
									html.push('<div class="msg">');
									html.push('<img style="'+mood+'" src="'+photo+'" alt="" />');
									html.push('<span style="position: absolute;right: 1.1rem;"></span>');
									if(content[i].type==1){
										html.push('<p>'+content[i].text+'</p>');
									}else if(content[i].type==2){
										html.push('<p> <img src="'+imgUrl+content[i].text+'" data-preview-src="" data-preview-group="1"></p>');
									}
									html.push('</div>');
								html.push('</div>');
							}else{
								html.push('<div class="send">');
									html.push('<div class="time">'+content[i].createTime+'</div>');
									html.push('<div class="msg">');
									html.push('<img style="'+toMood+'"  src="'+toPhoto+'" alt="" />');
									html.push('<span style="position: absolute;left: 1.1rem;"></span>');
									if(content[i].type==1){
										html.push('<p>'+content[i].text+'</p>');
									}else if(content[i].type==2){
										html.push('<p> <img src="'+imgUrl+content[i].text+'" data-preview-src="" data-preview-group="1"></p>');
									}
									html.push('</div>');
								html.push('</div>');
							}
						}else if(content[i].type==5){
							if(content[i].user_id!=userId){
								html.push('<div class="show">');
									html.push('<div class="time">提醒：'+content[i].text+'</div>');
								html.push('</div>');
							}
						}
					}
					$('#message').append(html.join(""));
					if(isView){
						upView();
					}
				}else{
					mui.toast('系统异常...',{ duration:'10', type:'div' });
				}
				intervalLock=false;
			}
		});
	}
	
	function page(pageNo,pageSize,isView){
		$.ajax({
			url: '[[${sysUrl}]]/wensay/chat/page',
			type: "post",
			data:{
				'toUserId': toUserId,
				'pageNo': pageNo,
				'pageSize':pageSize,
				'maxChatId':0
			},
			dataType: "json",
			success:function(data){
				if(data.meta.success){
					var content=data.data.content;
					var html=[];
					for (var i = 0; i < content.length; i++) {
						if(maxChatId==null || content[i].id>maxChatId){
							maxChatId=content[i].id;
						}
						if(content[i].type!=5){
							if(content[i].isown==1){
								html.push('<div class="show">');
									html.push('<div class="time">'+content[i].create_time+'</div>');
									html.push('<div class="msg">');
									html.push('<img style="'+mood+'"  src="'+photo+'" alt="" />');
									html.push('<span style="position: absolute;right: 1.1rem;"></span>');
									if(content[i].type==1){
										html.push('<p>'+content[i].text+'</p>');
									}else if(content[i].type==2){
										html.push('<p> <img src="'+imgUrl+content[i].text+'" data-preview-src="" data-preview-group="1"></p>');
									}
									html.push('</div>');
								html.push('</div>');
							}else{
								html.push('<div class="send">');
									html.push('<div class="time">'+content[i].create_time+'</div>');
									html.push('<div class="msg">');
									html.push('<img style="'+toMood+'"  src="'+toPhoto+'" alt="" />');
									html.push('<span style="position: absolute;left: 1.1rem;"></span>');
									if(content[i].type==1){
										html.push('<p>'+content[i].text+'</p>');
									}else if(content[i].type==2){
										html.push('<p> <img src="'+imgUrl+content[i].text+'" data-preview-src="" data-preview-group="1"></p>');
									}
									html.push('</div>');
								html.push('</div>');
							}
						}else if(content[i].type==5){
							if(content[i].user_id!=userId){
								html.push('<div class="show">');
									html.push('<div class="time">提醒：'+content[i].text+'</div>');
								html.push('</div>');
							}
						}
					}
					
					$('#message').append(html.join(""));
					if(isView){
						upView();
					}
					if(isInterval && interval==null){
						isInterval=false;
						interval=setInterval(function(){
							pageInterval(false);
						}, 1000);
					}
				}else{
					mui.toast('系统异常...',{ duration:'10', type:'div' });
				}
			}
		});
	}
	
	
	
	function save(type,text){
		$.ajax({
			url: '[[${sysUrl}]]/wensay/chat/save',
			type: "post",
			data:{
				'toUserId': toUserId,
				'type':type,
				'text': text
			},
			dataType: "json",
			success:function(data){
				if(data.meta.success){
					pageInterval(true);
					$("#text").val("");
					$(".footer").addClass("expressclose");
					$(".footer").removeClass("expressopen");
					upBtu();
				}else{
					mui.toast('系统异常...',{ duration:'10', type:'div' });
				}
			}
		});
	}
	
	
	
	$('#text').on('input',function(){
		upBtu();
		upView();
	})
	
	$('#submit').click(function(){
		var text=$("#text").val();
		if(text==''){
			mui.toast('输入发送内容',{ duration:'10', type:'div' });
			return;
		}
		save(1,text);
	})
	
	/*发送消恿*/
	function sendText(headSrc,str,name){
		var html="<div class='show'><div class='msg'><img src="+headSrc+" /><span style='position: absolute;right: 1.1rem;'>"+name+"</span>"+
		"<p>"+str+"</p></div></div>";
		$('.message').append(html);
		$("#text").val("");
		upBtu();
		upView();
	}
	
	/*发送图片*/
	function sendImg(headSrc,img,name){
		var html="<div class='show'><div class='msg'><img src="+headSrc+" /><span style='position: absolute;right: 1.1rem;'>"+name+"</span>"+
		"<p><img src='"+img+"'></p></div></div>";
		$('.message').append(html);
		$("#text").val("");
		upBtu();
		upView();
	}
	
	function showIco(){
		if($(".footer").hasClass("expressopen")){
			$(".footer").addClass("expressclose");
			$(".footer").removeClass("expressopen");
		}else{
			$(".footer").removeClass("expressclose");
			$(".footer").addClass("expressopen");
		}
		
	}
	
	
	/*更新视图*/
	function upView(){
		var ele = document.getElementById('message');
		$(document).scrollTop($("#message").outerHeight());
	}
	
	/*更新发送*/
	function upBtu(){
		if($("#text").val().length>0){
			$("#submit").css('background','linear-gradient(92deg,#ffba40 0%,#ff503e 37%,#ff2f50 81%,#ff1b40 100%)');
		}else{
			$("#submit").css('background','#ddd');
		}
	}
	
	var picArr = new Array();
	$('input:file').localResizeIMG({
		width: 800,
		quality: 1,
		// 图片压缩 默认1 不压缩
		success: function(result) {
			upload(result);
		}
	});
	
	
	function upload(result){
		mui.showLoading("正在发送..","div"); 
		var data={pic:result.base64}; 
        $.ajax({
            type: "POST",
            url: '[[${sysUrl}]]/file/upload',
            data: data,
            dataType:"json",
            success: function(data){
            	if(data.meta.success){
            		save(2,data.data.filePath);
        			console.log(picArr)
                }else{
            	   mui.toast('系统异常...',{ duration:'10', type:'div' });
                }
            	mui.hideLoading(function (){});
             },
             complete :function(XMLHttpRequest, textStatus){
            	 mui.hideLoading(function (){});
             },
             error:function(XMLHttpRequest, textStatus, errorThrown){ 
            	 mui.toast('系统异常...',{ duration:'10', type:'div' });
            	 mui.hideLoading(function (){});
             }
         }); 		
	}
	
	function sj(){
		return parseInt(Math.random()*10)
	}
	
	</script>
	
	
</html>